<template>
    <el-tabs type="border-card">
        <el-tab-pane label="所有用户"> <el-table
            :data="users" border style="width: 100%">
            <el-table-column prop="" label="头像"><template slot-scope="scope"><img width="25" :src="scope.row.headimgurl" alt=""></template></el-table-column>
            <!--<el-table-column prop="uid" label="ID"></el-table-column>-->
            <el-table-column prop="nickname" label="用户昵称"></el-table-column>
            <el-table-column prop="uid" label="用户id"></el-table-column>
            <el-table-column prop="createdAt" label="注册时间"></el-table-column>
            <el-table-column prop="sex" label="性别" :formatter="formatter"></el-table-column>
            <el-table-column prop="balance" label="账户资金(元)"></el-table-column>
            <el-table-column prop="openid" width="280px" label="openid"></el-table-column>
            <el-table-column prop="" width="" label="操作">
                <template slot-scope="scope">
                    <el-button @click="userbanHandle(scope.row.uid,'封禁')" type="danger">封禁</el-button>
                </template>
            </el-table-column>


        </el-table></el-tab-pane>
        <el-tab-pane label="已封禁用户"> <el-table
            :data="users2" border style="width: 100%">
            <el-table-column prop="" label="头像"><template slot-scope="scope"><img width="25" :src="scope.row.headimgurl" alt=""></template></el-table-column>
            <!--<el-table-column prop="uid" label="ID"></el-table-column>-->
            <el-table-column prop="nickname" label="用户昵称"></el-table-column>
            <el-table-column prop="createdAt" label="注册时间"></el-table-column>
            <el-table-column prop="sex" label="性别" :formatter="formatter"></el-table-column>
            <el-table-column prop="balance" label="账户资金(元)"></el-table-column>
            <el-table-column prop="openid" width="280px" label="openid"></el-table-column>
            <el-table-column prop="" width="" label="操作">
                <template slot-scope="scope">
                    <el-button @click="userbanHandle(scope.row.uid,'解封')" type="success">解封</el-button>
                </template>
            </el-table-column>


        </el-table></el-tab-pane>
    </el-tabs>

</template>

<script>
    export default {
        data() {
            return {
                tableData: [{date: '2016-05-02', name: '王小虎', address: '上海市普陀区金沙江路 1518 弄'}, {date: '2016-05-04', name: '王小虎', address: '上海市普陀区金沙江路 1517 弄'}, {date: '2016-05-01', name: '王小虎', address: '上海市普陀区金沙江路 1519 弄'}, {date: '2016-05-03', name: '王小虎', address: '上海市普陀区金沙江路 1516 弄'}],
                users:[],
                users2:[],
            }
        },

        methods:{
            userbanHandle(uid,type){
                if(type=='封禁'){
                    this.$axios.post('/api/user/ban',{uid}).then(res=>{
                        if(res.data.err_code == 0){
                            this.$message({
                                message:'封禁成功',
                                type:'success'
                            });
                            this.init();
                        }
                    })
                }else if(type=='解封'){
                    this.$axios.post('/api/user/cban',{uid}).then(res=>{
                        if(res.data.err_code == 0){
                            this.$message({
                                message:'解封成功',
                                type:'success'
                            });
                            this.init();
                        }
                    })
                }

            }
            ,
            formatter(row, column) {
                if(row.sex==0){
                    return '男'
                }else if(row.sex ==1){
                    return '女'
                }
                return '未知';
            },
            init(){
                this.$axios.post('/api/user/all').then(res =>{
                    if(res.data.err_code ==0){
                        this.users= res.data.data;
                    }
                });
                this.$axios.post('/api/user/isban').then(res =>{
                    if(res.data.err_code ==0){
                        this.users2= res.data.data;
                    }
                })
            }
        },
        created(){
            this.init()
        },

    }
</script>
